<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="lib/vue.js"></script>
</head>
<body>
<div id="root">
    <!--  字符串  -->
<!--    <p v-for="item in str" :key="item">{{item}}</p>-->
<!--    <p v-for="(item,i) in str" :key="i">{{item}}|{{i}}</p>-->
    <!--  数字  -->
<!--    <p v-for="item in num" :key="item">{{item}}</p>-->
<!--    <p v-for="(a,b) in num" :key="'suibian'+a">{{a}}|{{b}}</p>-->
    <!--  对象  -->
<!--    <p v-for="item in obj" :key="item">{{item}}</p>-->
<!--    <p v-for="(value,key) in obj" :key="key">{{value}}|{{key}}</p>-->
    <!--  数组  -->
<!--    <p v-for="item in arr" :key="item">{{item}}</p>-->
<!--    <p v-for="(item,index) in arr" :key="'key'+index">{{item}}|{{index}}</p>-->
</div>
</body>
<script>
	new Vue({
		el:"#root",
        data:{
			str:"中华人民共和国",
            num:10,
            obj:{
				username:"zhangsan",
                age:12
            },
            arr:[1,2,3,4]

        }
	})
</script>
</html>